<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>自定义查询设置列</title>
    <#include "/pubHeadStyle.html">
    <script src="${ctx}/extends/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<form class="layui-form" lay-filter="setFiled">
    <div style="position: relative;height: 100%;">
        <div class="ccpui-trees">
            <p class="isShowTree colorSwitch">
                <span style="float: left;color: white">&nbsp;&nbsp;获取字段列表</span>
            </p>
            <table id="tableField" lay-filter="tableField"></table>
        </div>
        <script type="text/html" id="toolbarDemo">
            <div style="position: absolute;left: 246px;top: 305px;">
                <button class="layui-btn layui-btn-sm" lay-event="getCheckData" type="button"><i
                        class="layui-icon layui-icon-right"></i></button>
            </div>
        </script>
        <div class="ccpui-coreContent" style="left:300px;">
            <p class="colorSwitch" style="width: 100%;height: 30px;line-height: 30px;">
                <span style="float: left;color: white">&nbsp;&nbsp;字段设置</span>
            </p>
            <div class="layui-collapse" lay-accordion="">
                <div class="layui-colla-item">
                    <h2 class="layui-colla-title">条件字段</h2>
                    <div class="layui-colla-content condition" style="padding-top:0;">
                        <div class="layui-tab" lay-filter="layTable">
                            <ul class="layui-tab-title">
                                <li class="layui-this">条件选择</li>
                                <li>java脚本</li>
                                <li>帮助</li>
                            </ul>
                            <div class="layui-tab-content">
                                <div class="layui-tab-item conditionTab layui-show">
                                    <table id="selectCondition" lay-filter="selectCondition"></table>
                                </div>
                                <div class="layui-tab-item scriptInput">
                                    <div style="width: 100%;margin:10px 0" id="scriptField"></div>
                                    <textarea name="javaScript" id="javaScript" cols="90" rows="10"
                                              style="resize:none"></textarea>
                                </div>
                                <div class="layui-tab-item">例：if(map.get("ACTDEFID")!=null)
                                    return " and ACTDEFID like '%"+map.get("ACTDEFID")+"%'" ;
                                    其中的map为系统所封装的一个参数
                                    在脚本中使用map.get("ACTDEFID")可以获取表单提交时所携带的ACTDEFID参数值，脚本应拼接并返回任意的可执行的sql语句
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-colla-item">
                    <h2 class="layui-colla-title">返回字段</h2>
                    <div class="layui-colla-content return">
                        <table id="returnField" lay-filter="returnField"></table>
                    </div>
                </div>
                <div class="layui-colla-item">
                    <h2 class="layui-colla-title">排序字段</h2>
                    <div class="layui-colla-content sort">
                        <div id="sortCheck">
                            <table id="sortField" lay-filter="sortField"></table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div style="position: absolute;top:508px;left:44%">
            <button class="layui-btn" type="button" lay-submit="" lay-filter="save">保存</button>
            <button class="layui-btn layui-btn-danger cancel">取消</button>
        </div>
    </div>
</form>
<script type="text/html" id="manageBar">
    <a class="layui-btn layui-btn-xs" lay-event="moveUp">上移</a>
    <a class="layui-btn layui-btn-xs" lay-event="moveDown">下移</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script type="text/html" id="selectType">
    {{#  if(d.dbType == 'number'){ }}
        <select name="selectValue"  lay-filter="selectValue" id="{{d.field}}">
            <option value="=">等于</option>
            <option value=">=">大于等于</option>
            <option value=">">大于</option>
            <option value="<">小于</option>
            <option value="<=">小于等于</option>
        </select>
    {{#  } else if(d.dbType == 'varchar'||d.dbType == 'text'||d.dbType == 'boolean'){ }}
        <select name="selectValue"  lay-filter="selectValue" id="{{d.field}}">
            <option value="=">等于</option>
            <option value="like">LIKE</option>
            <option value="likeEnd">LIKEEND</option>
        </select>
    {{#  } else if(d.dbType == 'date'){ }}
        <select name="selectValue"  lay-filter="selectValue" id="{{d.field}}">
            <option value="=">等于</option>
            <option value="between">Between</option>
            <option value=">=">大于等于</option>
            <option value="<=">小于等于</option>
        </select>
    {{#  } }}
</script>
<script type="text/html" id="DefaultSelect">
    <div class="displayCol">
        <select class="layui-yonyou-select rightSelect" lay-filter="valueType" name="rightSelect" id="default{{d.field}}">
            <option value='1'>参数传入</option>
            <option value='2'>固定值</option>
            <option value='3'>脚本</option>
        </select>
    </div>
</script>
<script>
    layui.config({
        base: serverPath.formPath + staticPath.formPath //静态资源所在路径
    }).extend({
        index: 'index' //主入口模块
    }).use(['index', 'table', 'layer', 'jquery', 'form', 'element', 'setter', 'commons'], function () {
        var table = layui.table, setter = layui.setter, $ = layui.jquery,layer = layui.layer,
            element = layui.element, form = layui.form, commons = layui.commons;
        var formQueryId = '${formQueryId}';
        var dsName = '${dsName}';
        var isTable = '${isTable}';
        var objectName = '${objectName}';
        var tab = 0;//判断tab 选项卡 哪个选中 默认0 条件选择
        //初始化面板
        element.init();
        if(formQueryId===""){
            var array = new Array();
            loadConditionField(array);
            loadSortField(array);
            loadReturnField(array);
        }
        //设置列后台接口
        $.ajax({
            url: serverPath.formPath + setter.formLinkPath +"formQuery/setCol",
            dataType: 'json',
            type: "post",
            async: false,
            data: {"formQueryId": formQueryId,"dsName":dsName,"isTable":isTable,"objectName":objectName,"type":1},
            success: function (result) {
                if(commons._filterRecord(result)){
                    //加载左侧表格数据
                    loadTable(result.data.tableModel.columnList);
                }
            }
        });
        //父页面数据回显
        var allData = parent.window.getArea();
        if(allData!==""){
            var res = JSON.parse(allData);
            var judge = true;
            if(res.conditionfield.length>0){
                if(res.conditionfield[0].defaultType==="5"){
                    judge = false;
                }
            }
            if(judge){
                //回显条件选择
                loadConditionField(res.conditionfield);
            }else{
                //回显java脚本
                tab = 1;
                $.each(res.conditionfield,function(i,item){
                    $("#scriptField").append('<a class="layui-btn layui-btn-xs" style="padding-right:15px;" onclick="addField(this)" comment="'+item.comment+'">'+item.field+'</a>'+
                        '<i style="color: red;position: relative;top:-2px;right:12px;width: 8px;height: 8px;" onclick="deletePrevious(this)">X</i>');
                });
                $("#javaScript").val(res.conditionfield[0].defaultValue);
                $('ul li').each(function(i,item){
                    $(item).attr("class","");
                    if($.trim($(item).text())==="java脚本"){
                        $(item).attr("class","layui-this");
                        $(".scriptInput").attr("class","layui-tab-item scriptInput layui-show");
                        $(".conditionTab").attr("class","layui-tab-item conditionTab");
                    }
                });
                loadConditionField(new Array());
            }
            //回显排序字段
            loadSortField(res.sortfield);
            //回显返回字段
            loadReturnField(res.resultfield);
        }

        //关闭弹窗
        $(".cancel").on('click', function () {
            parent.layer.close(parent.layer.getFrameIndex(window.name))
        });

        form.on('select(valueType)', function (data) {
            var fieldName = $(this).parents(".layui-table-cell").parent().prev().prev().prev().prev().children().text();
            var selectorHtml = "<div style='margin-top:10px;' class='selectorDiv'>";
            var userButton = "<input type='text' class='layui-input' style='float: left;height: 30px;margin-right:5px;width: 150px'></div>";
            var appendHtml = selectorHtml + userButton;
            var scriptButton = "<textarea id='script_"+fieldName+"' class='layui-input' style='float: left;height: 30px;width: 150px;margin-right:5px;'></textarea><button type='button' class='layui-btn layui-btn-xs selectScript'>选择</button></div>";
            var newAppendHtml = selectorHtml + scriptButton;
            if (data.value === '1') {
                $(this).parent().parent().parent().find(".selectorDiv").remove();
            }
            else if(data.value==='2'){
                $(this).parent().parent().parent().find(".selectorDiv").remove();
                $(this).parent().parent().parent().append(appendHtml);
            }
            else if(data.value==='3'){
                $(this).parent().parent().parent().find(".selectorDiv").remove();
                $(this).parent().parent().parent().append(newAppendHtml);
            }
        });

        //layui Tab选项卡切换
        element.on('tab(layTable)', function(data){
            if(data.index === 0){//条件选择
                tab = 0;
            } else if(data.index === 1){//java脚本
                tab = 1;
            }
        });
        //监听提交
        form.on('submit(save)', function (data) {
            //条件字段数据ConditionField
            var conditionArray = [];
            if(tab===0){
                var conditionFieldArray = $("#selectCondition").next().find("tbody").children();
                for (var k = 0; k < conditionFieldArray.length; k++) {
                    var jsonCondition = {};
                    jsonCondition.field = $($(conditionFieldArray[k]).find("td").get(0)).find("div").html();
                    jsonCondition.comment = $($(conditionFieldArray[k]).find("td").get(2)).find("div").html();
                    jsonCondition.condition = $($(conditionFieldArray[k]).find("td").get(1)).find("select").find("option:selected").val();
                    jsonCondition.dbType = $($(conditionFieldArray[k]).find("td").get(3)).find("div").html();
                    jsonCondition.defaultType = $($(conditionFieldArray[k]).find("td").get(4)).find("select").find("option:selected").val();
                    if(jsonCondition.defaultType==="2"){
                        jsonCondition.defaultValue = $($(conditionFieldArray[k]).find("td").get(4)).find("select").next().next().find("input").val();
                    }else if(jsonCondition.defaultType==="3"){
                        jsonCondition.defaultValue = $($(conditionFieldArray[k]).find("td").get(4)).find("select").next().next().find("textarea").val();
                    }else{
                        jsonCondition.defaultValue = "";
                    }
                    conditionArray.push(jsonCondition);
                }
            }else{
                var javaScript = $("#javaScript").val();
                var scriptField = $("#scriptField").find("a");
                for (var h = 0; h < scriptField.length; h++) {
                    var jsonJavaScript = {};
                    jsonJavaScript.field = $(scriptField[h]).text();
                    jsonJavaScript.comment = $(scriptField[h]).attr("comment");
                    jsonJavaScript.defaultType = "5";
                    jsonJavaScript.condition = "";
                    jsonJavaScript.dbType = "";
                    jsonJavaScript.defaultValue = javaScript;
                    conditionArray.push(jsonJavaScript);
                }
                if(scriptField.length===0){
                    var jsonScript = {};
                    jsonScript.field = "";
                    jsonScript.comment = "";
                    jsonScript.defaultType = "5";
                    jsonScript.condition = "";
                    jsonScript.dbType = "";
                    jsonScript.defaultValue = javaScript;
                    conditionArray.push(jsonScript);
                }
            }
            //返回字段数据ReturnField
            var returnFieldArray = $("#returnField").next().find("tbody").children();
            var returnArray = [];
            for (var i = 0; i < returnFieldArray.length; i++) {
                var jsonReturn = {};
                jsonReturn.field = $($(returnFieldArray[i]).find("td").get(0)).find("div").html();
                jsonReturn.comment = $($(returnFieldArray[i]).find("td").get(1)).find("div").html();
                returnArray.push(jsonReturn);
            }
            if(returnArray.length===0){
                layer.alert("请选择返回字段!");
                return false;
            }
            //排序字段数据SortField
            var sortFieldArray = $("#sortField").next().find("tbody").children();
            var sortArray = [];
            for (var j = 0; j < sortFieldArray.length; j++) {
                var jsonSort = {};
                jsonSort.field = $($(sortFieldArray[j]).find("td").get(0)).find("div").html();
                if($($(sortFieldArray[j]).find("td").get(1)).find("input[type='checkbox']").prop("checked")){
                    jsonSort.comment = "ASC";
                }else{
                    jsonSort.comment = "DESC";
                }
                sortArray.push(jsonSort);
            }
            parent.window.addSetCol(conditionArray,returnArray,sortArray,1);
            parent.layer.close(parent.layer.getFrameIndex(window.name));
        });
        //脚本选择弹窗
        $(document).on('click',".selectScript",function(){
            var areaId = $(this).prev().attr("id");
            parent.layer.open({
                type: 2,
                area: ["800px","650px"],
                title: ['脚本选择'],
                content: serverPath.formPath + setter.formLinkPath + "table/view/script?param=1&parentName="+window.name+"&scriptObj="+areaId
            });
        });

        //左侧表格数据
        function loadTable(data){
            table.render({
                elem: '#tableField'
                , data: data
                , title: '字段表'
                , height: 'full-100'
                , toolbar: '#toolbarDemo'
                , defaultToolbar: []
                , cols: [[
                    {type: 'checkbox'}
                    , {field: 'name', title: '字段', align: 'center'}
                    , {field: 'comment', title: '注释', align: 'center', edit: 'text'}
                    , {field: 'columnType', title: '字段类型', align: 'center', hide: true}
                ]]
                , page: false
                , limit: 1000
            });
        }

        //穿梭框 向右按钮功能
        table.on('toolbar(tableField)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id); //获取选中行状态
            switch (obj.event) {
                case 'getCheckData':
                    var result = checkStatus.data;  //获取选中行数据
                    for(var n=0; n<result.length; n++){
                        result[n].field = result[n].name;
                        result[n].dbType = result[n].columnType;
                    }
                    //1.穿梭到-java脚本
                    if ($(".scriptInput").hasClass("layui-show")) {

                        var scriptField = $("#scriptField").find("a");
                        for (var i = 0; i < result.length; i++) {
                            //如果java脚本中已经有了相同的则跳过
                            var judge = false;
                            for (var h = 0; h < scriptField.length; h++) {
                                if($(scriptField[h]).text()===result[i].name){
                                    judge = true;
                                }
                            }
                            if(judge){
                                continue;
                            }
                            var name = result[i].name;
                            var comment = result[i].comment;
                            $("#scriptField").append('<a class="layui-btn layui-btn-xs" style="padding-right:15px;" onclick="addField(this)" comment="'+comment+'">'+name+'</a>'+
                                '<i style="color: red;position: relative;top:-2px;right:12px;width: 8px;height: 8px;" onclick="deletePrevious(this)">X</i>');
                        }
                    }
                    //2.穿梭到-条件选择
                    if ($(".condition").hasClass("layui-show") && $(".conditionTab").hasClass("layui-show")) {
                        //loadConditionField(result);
                        for (var a = 0; a < result.length; a++) {
                            var conditionArray = $("#selectCondition").next().find("tbody").children();
                            //如果条件选择中已经有了相同的则跳过
                            var judge = false;
                            for (var b = 0; b < conditionArray.length; b++) {
                                if($($(conditionArray[b]).get(0)).find("div").html()===result[a].field){
                                    judge = true;
                                }
                            }
                            if(judge){
                                continue;
                            }
                            $("#selectCondition").next().find("div .layui-none").remove();//去掉 无数据三个字
                            var option = '';
                            if(result[a].dbType==='varchar'||result[a].dbType==='text'||result[a].dbType==='boolean'){
                                option = '<option value="=">等于</option> \n' +
                                         '<option value="like">LIKE</option> \n' +
                                         '<option value="likeEnd">LIKEEND</option>';
                            }else if(result[a].dbType==='number'){
                                option = '<option value="=">等于</option>\n' +
                                         '<option value=">=">大于等于</option>\n' +
                                         '<option value=">">大于</option>\n' +
                                         '<option value="<">小于</option>\n' +
                                         '<option value="<=">小于等于</option>';
                            }else if(result[a].dbType==='date'){
                                option = '<option value="=">等于</option>\n' +
                                         '<option value="between">Between</option>\n' +
                                         '<option value=">=">大于等于</option>\n' +
                                         '<option value="<=">小于等于</option>';
                            }
                            var optionDD = '';
                            if(result[a].dbType==='varchar'||result[a].dbType==='text'||result[a].dbType==='boolean'){
                                optionDD = '<dd lay-value="=" class="layui-this">等于</dd>\n' +
                                           '<dd lay-value="like" class="">LIKE</dd>\n' +
                                           '<dd lay-value="likeEnd" class="">LIKEEND</dd>';
                            }else if(result[a].dbType==='number'){
                                optionDD = '<dd lay-value="=" class="layui-this">等于</dd>\n' +
                                           '<dd lay-value=">=" class="">大于等于</dd>\n' +
                                           '<dd lay-value=">" class="">大于</dd>\n' +
                                           '<dd lay-value="<" class="">小于</dd>\n' +
                                           '<dd lay-value="<=" class="">小于等于</dd>';
                            }else if(result[a].dbType==='date'){
                                optionDD = '<dd lay-value="=" class="layui-this">等于</dd>\n' +
                                           '<dd lay-value="between" class="">Between</dd>\n' +
                                           '<dd lay-value=">=" class="">大于等于</dd>\n' +
                                           '<dd lay-value="<=" class="">小于等于</dd>';
                            }
                            $("#selectCondition").next().find("tbody").append(
                                '<tr data-index="'+conditionArray.length+'" class="">\n' +
                                '<td data-field="field" data-key="5-0-0" style="width:110px" align="center" class="">\n' +
                                '<div class="layui-table-cell laytable-cell-5-0-0" style="width:110px">'+result[a].field+'</div>\n' +
                                '</td>\n' +
                                '<td data-field="1" data-key="5-0-1" align="center" style="width:130px" data-content="" class="layui-table-col-special">\n' +
                                '<div class="layui-table-cell laytable-cell-5-0-1" style="width:130px">  \n' +
                                '<select name="selectValue" lay-filter="selectValue" id="'+result[a].field+'"> \n' +
                                option +
                                '</select>\n' +
                                '<div class="layui-unselect layui-form-select">\n' +
                                '<div class="layui-select-title">\n' +
                                '<input type="text" placeholder="请选择" value="等于" readonly="" class="layui-input layui-unselect">\n' +
                                '<i class="layui-edge"></i>\n' +
                                '</div>\n' +
                                '<dl class="layui-anim layui-anim-upbit">\n' +
                                optionDD +
                                '</dl>\n' +
                                '</div>  \n' +
                                '</div>\n' +
                                '</td>\n' +
                                '<td data-field="comment" data-key="5-0-2" style="width:110px" align="center" class="">\n' +
                                '<div class="layui-table-cell laytable-cell-5-0-2" style="width:110px">'+result[a].comment+'</div>\n' +
                                '</td>\n' +
                                '<td data-field="dbType" data-key="5-0-3" align="center" class="layui-hide">\n' +
                                '<div class="layui-table-cell laytable-cell-5-0-3">'+result[a].dbType+'</div>\n' +
                                '</td>\n' +
                                '<td data-field="4" data-key="5-0-4" style="width：222px" data-content="" class="layui-table-col-special">\n' +
                                '<div class="layui-table-cell laytable-cell-5-0-4" style="width:222px">\n' +
                                '<div class="displayCol"> \n' +
                                '<select class="layui-yonyou-select rightSelect" lay-filter="valueType" name="rightSelect" id="default'+result[a].field+'"> \n' +
                                '<option value="1">参数传入</option> \n' +
                                '<option value="2">固定值</option> \n' +
                                '<option value="3">脚本</option> \n' +
                                '</select>\n' +
                                '<div class="layui-unselect layui-form-select">\n' +
                                '<div class="layui-select-title">\n' +
                                '<input type="text" placeholder="请选择" value="参数传入" readonly="" class="layui-input layui-unselect">\n' +
                                '<i class="layui-edge"></i>\n' +
                                '</div>\n' +
                                '<dl class="layui-anim layui-anim-upbit">\n' +
                                '<dd lay-value="1" class="layui-this">参数传入</dd>\n' +
                                '<dd lay-value="2" class="">固定值</dd>\n' +
                                '<dd lay-value="3" class="">脚本</dd>\n' +
                                '</dl>\n' +
                                '</div> \n' +
                                '</div> \n' +
                                '</div>\n' +
                                '</td>\n' +
                                '<td data-field="operation" data-key="5-0-5" style="width:160px" align="center" data-off="true" class="">\n' +
                                '<div class="layui-table-cell laytable-cell-5-0-5" style="width:160px"> \n' +
                                '<a class="layui-btn layui-btn-xs" lay-event="moveUp">上移</a> \n' +
                                '<a class="layui-btn layui-btn-xs" lay-event="moveDown">下移</a> \n' +
                                '<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> \n' +
                                '</div>\n' +
                                '</td>\n' +
                                '</tr>');
                            form.render();
                        }
                    }
                    //3.穿梭到-返回字段
                    if ($(".return").hasClass("layui-show")) {
                        //loadReturnField(result);
                        for (var a = 0; a < result.length; a++) {
                            var returnArray = $("#returnField").next().find("tbody").children();
                            //如果条件选择中已经有了相同的则跳过
                            var judge = false;
                            for (var b = 0; b < returnArray.length; b++) {
                                if($($(returnArray[b]).get(0)).find("div").html()===result[a].field){
                                    judge = true;
                                }
                            }
                            if(judge){
                                continue;
                            }
                            $("#returnField").next().find("div .layui-none").remove();//去掉 无数据三个字
                            $("#returnField").next().find("tbody").append(
                                '<tr data-index="'+returnArray.length+'" class="">\n' +
                                '<td data-field="field" data-key="3-0-0" align="center" class="">\n' +
                                '<div class="layui-table-cell laytable-cell-3-0-0">'+result[a].field+'</div>\n' +
                                '</td>\n' +
                                '<td data-field="comment" data-key="3-0-1" align="center" class="">\n' +
                                '<div class="layui-table-cell laytable-cell-3-0-1">'+result[a].comment+'</div>\n' +
                                '</td>\n' +
                                '<td data-field="operation" data-key="3-0-2" align="center" data-off="true" class="">\n' +
                                '<div class="layui-table-cell laytable-cell-3-0-2"> \n' +
                                '<a class="layui-btn layui-btn-xs" lay-event="moveUp">上移</a> \n' +
                                '<a class="layui-btn layui-btn-xs" lay-event="moveDown">下移</a> \n' +
                                '<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> \n' +
                                '</div>\n' +
                                '</td>\n' +
                                '</tr>');
                            form.render();
                        }
                    }
                    //4.穿梭到-排序字段
                    if ($(".sort").hasClass("layui-show")) {
                        //loadSortField(result);
                        for (var h = 0; h < result.length; h++) {
                            var sortArray = $("#sortField").next().find("tbody").children();
                            //如果条件选择中已经有了相同的则跳过
                            var judge = false;
                            for (var b = 0; b < sortArray.length; b++) {
                                if($($(sortArray[b]).get(0)).find("div").html()===result[h].field){
                                    judge = true;
                                }
                            }
                            if(judge){
                                continue;
                            }
                            $("#sortField").next().find("div .layui-none").remove();//去掉 无数据三个字
                            $("#sortField").next().find("tbody").append(
                                '<tr data-index="'+sortArray.length+'" class="">\n' +
                                '<td data-field="field" data-key="5-0-0" style="width:260px" align="center" class="">\n' +
                                '<div class="layui-table-cell laytable-cell-5-0-0" style="width:260px">'+result[h].field+'</div>\n' +
                                '</td>\n' +
                                '<td data-field="comment" data-key="5-0-1" style="width:260px" align="center" data-content="'+result[h].comment+'" class="">\n' +
                                '<div class="layui-table-cell laytable-cell-5-0-1" style="width:260px">\n' +
                                '<input type="checkbox" lay-skin="primary" title="升序(不勾选则为降序)" id="checkbox'+result[h].field+'">\n' +
                                '<div class="layui-unselect layui-form-checkbox" lay-skin="primary">\n' +
                                '<span>升序(不勾选则为降序)</span>\n' +
                                '<i class="layui-icon layui-icon-ok"></i>\n' +
                                '</div>\n' +
                                '</div>\n' +
                                '</td>\n' +
                                '<td data-field="operation" data-key="5-0-2" style="width:234px" align="center" data-off="true" class="">\n' +
                                '<div class="layui-table-cell laytable-cell-5-0-2" style="width:234px"> \n' +
                                '<a class="layui-btn layui-btn-xs" lay-event="moveUp">上移</a> \n' +
                                '<a class="layui-btn layui-btn-xs" lay-event="moveDown">下移</a> \n' +
                                '<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> \n' +
                                '</div>\n' +
                                '</td>\n' +
                                '</tr>');
                            form.render();
                        }
                    }
                    break;
            }
        });
        //加载条件选择表格
        function loadConditionField(data){
            table.render({
                elem: '#selectCondition'
                , data: data
                , title: '条件选择'
                , height: 'full-320'
                , cols: [[
                    {field: 'field', title: '字段名', width: 110, align: 'center'}
                    , {title: '条件', width: 130, align: 'center', templet:'#selectType'}
                    , {field: 'comment', title: '显示名', width: 110, align: 'center'}
                    , {field: 'dbType', title: '字段类型', align: 'center', hide: true}
                    , {title: '默认值', width: 222, templet:'#DefaultSelect'}
                    , {field: 'operation', toolbar: '#manageBar', width: 160, title: '管理', align: 'center'}
                ]]
                , page: false
                , limit: 1000
                ,done: function (res, curr, count) {
                    // 循环表格中每一行
                    $.each(res.data,function(i,item){
                        //select回显
                        $("#"+res.data[i].field).val(res.data[i].condition);
                        $("#default"+res.data[i].field).val(res.data[i].defaultType);
                        if(res.data[i].defaultType==="2"){
                            $("#default"+res.data[i].field).parent().append("<div style='margin-top:10px;' class='selectorDiv'>" +
                                "<input type='text' class='layui-input' style='float: left;height: 30px;margin-right:5px;width: 150px' value='"+res.data[i].defaultValue+"'>" +
                                "</div>");
                        }else if(res.data[i].defaultType==="3"){
                            $("#default"+res.data[i].field).parent().append("<div style='margin-top:10px;' class='selectorDiv'>" +
                                "<textarea id='script_"+res.data[i].field+"' class='layui-input' style='float: left;height: 30px;width: 150px;margin-right:5px;'>"+res.data[i].defaultValue+"</textarea>" +
                                "<button type='button' class='layui-btn layui-btn-xs selectScript'>选择</button>" +
                                "</div>");
                        }
                    });
                    form.render('select');
                }
            });
        }
        //加载返回字段表格
        function loadReturnField(data){
            table.render({
                elem: '#returnField'
                , data: data
                , title: '返回字段'
                , height: 'full-300'
                , cols: [[
                    {field: 'field', title: '字段名', width: 260, align: 'center'}
                    , {field: 'comment', title: '显示名', width: 260, align: 'center'}
                    , {field: 'operation', toolbar: '#manageBar', width: 234, title: '管理', align: 'center'}
                ]]
                , page: false
                , limit: 1000
            });
        }
        //加载排序字段表格
        function loadSortField(data){
            table.render({
                elem: '#sortField'
                , data: data
                , title: '排序字段'
                , height: 'full-300'
                , cols: [[
                    {field: 'field', title: '字段名', width: 260, align: 'center'}
                    , {
                        field: 'comment', title: '排序', width: 260, align: 'center'
                        , templet: function (d) {
                            return '<input type="checkbox" lay-skin="primary" title="升序(不勾选则为降序)" id="checkbox'+d.field+'"/>'

                        }
                    }
                    , {field: 'operation', toolbar: '#manageBar', width: 234, title: '管理', align: 'center'}
                ]]
                , page: false
                , limit: 1000
                ,done: function (res, curr, count) {
                    // 循环表格中每一行
                    $.each(res.data,function(i,item){
                        //checkbox回显
                        $("#checkbox"+res.data[i].field).prop("checked",res.data[i].comment=="ASC"?true:false);
                    });
                    form.render('checkbox');
                }
            });
        }

        //监听条件选择行工具
        table.on('tool(selectCondition)', function (obj) {
            var data_tr = $(this);
            switch (obj.event) {
                case 'moveUp':
                    var tr = $(data_tr).parent().parent().parent();
                    $(tr).insertBefore($(tr).prev());
                    break;
                case 'moveDown':
                    var tr = $(data_tr).parent().parent().parent();
                    $(tr).insertAfter($(tr).next());
                    break;
                case 'del':
                    parent.layer.confirm('确定删除当前数据吗？', {
                        btn: ['确定', '取消'] //按钮
                    }, function (index) {
                        var delObj = obj.data;
                        obj.del();
                        parent.layer.close(index);
                    });
                    break;
            }
        });

        //监听返回字段行工具
        table.on('tool(returnField)', function (obj) {
            var data_tr = $(this);
            switch (obj.event) {
                case 'moveUp':
                    var tr = $(data_tr).parent().parent().parent();
                    $(tr).insertBefore($(tr).prev());
                    break;
                case 'moveDown':
                    var tr = $(data_tr).parent().parent().parent();
                    $(tr).insertAfter($(tr).next());
                    break;
                case 'del':
                    parent.layer.confirm('确定删除当前数据吗？', {
                        btn: ['确定', '取消'] //按钮
                    }, function (index) {
                        var delObj = obj.data;
                        obj.del();
                        parent.layer.close(index);
                    });
                    break;
            }
        });
        //监听排序行工具
        table.on('tool(sortField)', function (obj) {
            var data_tr = $(this);
            switch (obj.event) {
                case 'moveUp':
                    var tr = $(data_tr).parent().parent().parent();
                    $(tr).insertBefore($(tr).prev());
                    break;
                case 'moveDown':
                    var tr = $(data_tr).parent().parent().parent();
                    $(tr).insertAfter($(tr).next());
                    break;
                case 'del':
                    parent.layer.confirm('确定删除当前数据吗？', {
                        btn: ['确定', '取消'] //按钮
                    }, function (index) {
                        var delObj = obj.data;
                        obj.del();
                        parent.layer.close(index);
                    });
                    break;
            }
        });
    });
    //删除前面的元素
    function deletePrevious(ele){
        $(ele).prev().remove();
        $(ele).remove();
    }
    //在textarea中添加字段
    function addField(ele){
        $("#javaScript").insertAtCaret($(ele).text());
    }
    //在光标处插入数据
    $.fn.extend({
        insertAtCaret: function (myValue) {
            var $t = $(this)[0];
            if (document.selection) {
                this.focus();
                sel = document.selection.createRange();
                sel.text = myValue;
                this.focus();
            } else
            if ($t.selectionStart || $t.selectionStart == '0')
            {
                var startPos = $t.selectionStart;
                var endPos = $t.selectionEnd;
                var scrollTop = $t.scrollTop;
                $t.value = $t.value.substring(0, startPos) + myValue + $t.value.substring(endPos,$t.value.length);
                this.focus();
                $t.selectionStart = startPos + myValue.length;
                $t.selectionEnd = startPos + myValue.length;
                $t.scrollTop = scrollTop;
            } else {
                this.value += myValue;
                this.focus();
            }
        }
    })
</script>
<style>
    .layui-colla-content {
        background: #fff;
    }

    .layui-table-tool {
        max-width: 1px;
        z-index: 1;
        position: absolute;
        top: -72px;
    }

    #sortCheck .layui-table-cell .layui-form-checkbox[lay-skin=primary] {
        padding-left: 28px;
    }
    .conditionTab .laytable-cell-2-0-4 ,.conditionTab .laytable-cell-2-0-1{
        overflow: visible;
        height: auto;
    }
    .conditionTab .laytable-cell-5-0-4 ,.conditionTab .laytable-cell-5-0-1{
        overflow: visible;
        height: auto;
    }
    .conditionTab .laytable-cell-1-0-4 ,.conditionTab .laytable-cell-1-0-1{
        overflow: visible;
        height: auto;
    }
   .displayCol .layui-form-select{
       width: 97px;
   }
    .conditionTab .layui-table-body{
        overflow-x: hidden;
    }
</style>
</body>
</html>